<template>
    <lib-doc :libDocData="libDocData"></lib-doc>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import LibDoc from '@/components/LibDoc.vue'
import { LibDocInterface } from '@/service/LibDocService'
export default defineComponent({
    name: 'i_transfer_tree_demo',
    setup () {
        const libDocData: LibDocInterface = {
            title: '穿梭框树',
            docList: [
                {
                    label: '引入组件',
                    value: `
    import { ITransferTree } from 'wd-platform-library''
    import { TransferDataInterface } from 'wd-platform-library/lib/src/ITransferTable/src/ITransferTableInterFace'`
                },
                {
                    label: '穿梭框树对象',
                    type: 'pre',
                    value: `
   const transferTreeData = reactive < TransferTreeDataInterface<any> >({
            dataList: [],  // 数据源集合
            checkList: [], // 选中数据集合
            treeOptions: {
                checkStrictly: false,
                defaultExpandAll: false
            },
            options: {
                disabled: false
            },
            replaceField: { key: 'id', title: 'name', disabled: 'disabled', children: 'children' }
        })`
                },
                {
                    label: '获取选中值(ref调用)',
                    type: 'pre',
                    value: `
         transferRef.value.checkTransferDataList()`
                },
                {
                    label: '数据左右转移回调方法',
                    type: 'pre',
                    value: `
        //selectKeys 回传参数:右侧选中的集合 @chagneTreeDataFun="chagneTreeDataFun"
        const chagneTreeDataFun = (selectKeys:string[]) => {
            alert(selectKeys)
        }`
                }

            ]
        }
        return {
            libDocData
        }
    },
    methods: {},
    components: { LibDoc }
})
</script>
